﻿<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="analysis.aspx.cs" Inherits="lauimini_webform.analysis" %>

<%@ Import Namespace="lauimini_webform.BLL" %>
<%@ Import Namespace="lauimini_webform.Data" %>
<!DOCTYPE html>

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <title></title>
    <%--  <link href="Static/css/index2.css" rel="stylesheet" />--%>
    <script src="Static/lib/echarts.min.js"></script>
    <link href="Static/lib/layui-v2.6.3/css/layui.css" rel="stylesheet" />
    <style>
        .body {
            width: 100%;
            height: 400px;
        }

        #first {
            display: flex;
            width: 100%;
            height: 200px;
        }

        #second {
            display: flex;
            width: 100%;
            height: 200px;
        }

        #sl {
            height: 472.5px;
        }

        #sr {
            height: 472.5px;
        }

        #fl {
            height: 472.5px;
        }

        #fr {
            height: 472.5px;
        }
    </style>
</head>
<body>
    <div class="layui-fluid">
        <div class="layui-row">
            <div class="layui-col-md6 ">
                <div id="fl" style="height: 350px;"></div>
            </div>
            <div class="layui-col-md6 ">
                <div id="fr" style="height: 350px;"></div>
            </div>
        </div>


        <div class="layui-row">
            <div class="layui-col-md6 ">
                <div id="sl" style="height: 350px;"></div>
            </div>
            <div class="layui-col-md6 ">
                <div id="sr" style="height: 350px;"></div>
            </div>
        </div>



    </div>

</body>

<% MyDBContext dB = new MyDBContext();
    UserService userService = new UserService();
    UserTargetService userTargetService = new UserTargetService();
    string userAccount = Session["userAccount"].ToString();
    int userid = userService.getUserid(userAccount);
    int mondayfinish = userTargetService.getWeekFinishMyTargetCount(userid, "Monday", "已完成");
    int Tuesdayfinish = userTargetService.getWeekFinishMyTargetCount(userid, "Tuesday", "已完成");
    int Wednesdayfinish = userTargetService.getWeekFinishMyTargetCount(userid, "Wednesday", "已完成");
    int Thursdayfinish = userTargetService.getWeekFinishMyTargetCount(userid, "Thursday", "已完成");
    int Fridayfinish = userTargetService.getWeekFinishMyTargetCount(userid, "Friday", "已完成");
    int Saturdayfinish = userTargetService.getWeekFinishMyTargetCount(userid, "Saturday", "已完成");
    int Sundayfinish = userTargetService.getWeekFinishMyTargetCount(userid, "Sunday", "已完成");

    int monfinsh = userTargetService.getMonthFinishMyTargetCount(userid, 1, "已完成");


%>
<script>
    var chartDom = document.getElementById('fl');
    var myChart = echarts.init(chartDom);
    var option;

    option = {
        title: {
            text: '每月完成数',
            subtext: '',
            left: 'center'
        },
        tooltip: {
            trigger: 'item'
        },
        legend: {
            orient: 'vertical',
            left: 'left'
        },
        xAxis: {
            type: 'category',
            boundaryGap: false,
            data: ['一', '二', '三', '四', '五', '六', '七', '八', '九', '十', '十一', '十二']
        },
        yAxis: {
            type: 'value'
        },
        series: [
            {
                data: [
                        <%=userTargetService.getMonthFinishMyTargetCount(userid,1,"已完成")%>,
                        <%=userTargetService.getMonthFinishMyTargetCount(userid,2,"已完成")%>,
                        <%=userTargetService.getMonthFinishMyTargetCount(userid,3,"已完成")%>,
                        <%=userTargetService.getMonthFinishMyTargetCount(userid,4,"已完成")%>,
                        <%=userTargetService.getMonthFinishMyTargetCount(userid,5,"已完成")%>,
                        <%=userTargetService.getMonthFinishMyTargetCount(userid,6,"已完成")%>,
                        <%=userTargetService.getMonthFinishMyTargetCount(userid,7,"已完成")%>,
                        <%=userTargetService.getMonthFinishMyTargetCount(userid,8,"已完成")%>,
                        <%=userTargetService.getMonthFinishMyTargetCount(userid,9,"已完成")%>,
                        <%=userTargetService.getMonthFinishMyTargetCount(userid,10,"已完成")%>,
                        <%=userTargetService.getMonthFinishMyTargetCount(userid,11,"已完成")%>,
                        <%=userTargetService.getMonthFinishMyTargetCount(userid,12,"已完成")%>,



                ],
                type: 'line',
                areaStyle: {}
            }
        ]
    };

    option && myChart.setOption(option);
</script>

<script>
    var chartDom = document.getElementById('fr');
    var myChart = echarts.init(chartDom);
    var option;

    option = {
        title: {
            text: '每月未成数',
            subtext: '',
            left: 'center'
        },
        tooltip: {
            trigger: 'item'
        },
        legend: {
            orient: 'vertical',
            left: 'left'
        },
        xAxis: {
            type: 'category',
            data: ['一', '二', '三', '四', '五', '六', '七', '八', '九', '十', '十一', '十二']
        },
        yAxis: {
            type: 'value'
        },
        series: [
            {
                data: [
                        <%=userTargetService.getMonthFinishMyTargetCount(userid,1,"未完成")%>,
                        <%=userTargetService.getMonthFinishMyTargetCount(userid,2,"未完成")%>,
                        <%=userTargetService.getMonthFinishMyTargetCount(userid,3,"未完成")%>,
                        <%=userTargetService.getMonthFinishMyTargetCount(userid,4,"未完成")%>,
                        <%=userTargetService.getMonthFinishMyTargetCount(userid,5,"未完成")%>,
                        <%=userTargetService.getMonthFinishMyTargetCount(userid,6,"未完成")%>,
                        <%=userTargetService.getMonthFinishMyTargetCount(userid,7,"未完成")%>,
                        <%=userTargetService.getMonthFinishMyTargetCount(userid,8,"未完成")%>,
                        <%=userTargetService.getMonthFinishMyTargetCount(userid,9,"未完成")%>,
                        <%=userTargetService.getMonthFinishMyTargetCount(userid,10,"未完成")%>,
                        <%=userTargetService.getMonthFinishMyTargetCount(userid,11,"未完成")%>,
                        <%=userTargetService.getMonthFinishMyTargetCount(userid,12,"未完成")%>,



                ],
                type: 'line',
                smooth: true
            }
        ]
    };

    option && myChart.setOption(option);
</script>

<script>

    var chartDom = document.getElementById('sl');
    var myChart = echarts.init(chartDom);
    var option;

    option = {
        title: {
            text: '已完成与未完成数',
            subtext: '',
            left: 'center'
        },
        tooltip: {
            trigger: 'item'
        },
        legend: {
            orient: 'vertical',
            left: 'left'
        },
        series: [
            {
                name: 'Access From',
                type: 'pie',
                radius: '50%',
                data: [
                    { value: <%=userTargetService.getFinishMyTarget(userid).Count%>, name: '已完成' },
                    { value: <%=userTargetService.getNoFinishMyTarget(userid).Count%>, name: '未完成' }
                ],
                emphasis: {
                    itemStyle: {
                        shadowBlur: 10,
                        shadowOffsetX: 0
                        // shadowColor: 'rgba(0, 0, 0, 0.5)'
                    }
                }
            }
        ]
    };

    option && myChart.setOption(option);

</script>
<script>


    var chartDom = document.getElementById('sr');
    var myChart = echarts.init(chartDom);
    var option;

    option = {
        title: {
            text: '不同工作日完成数',
            subtext: '',
            left: 'center'
        },
        tooltip: {
            trigger: 'item'
        },
        legend: {
            orient: 'vertical',
            left: 'left'
        },
        xAxis: {
            type: 'category',
            data: ['一', '二', '三', '四', '五', '六', '日']
        },
        yAxis: {
            type: 'value'
        },
        series: [
            {
                data: [
                    {
                        value: <%=mondayfinish%>,
                        itemStyle: {
                            color: '#5470c6'
                        }
                    },

                    {
                        value: <%=Tuesdayfinish%>,
                        itemStyle: {
                            color: '#a90000'
                        }
                    },
                    {
                        value: <%=Wednesdayfinish%>,
                        itemStyle: {
                            color: '#9fe080'
                        }
                    },
                    {
                        value: <%=Thursdayfinish%>,
                        itemStyle: {
                            color: '#ffdc60'
                        }
                    },
                    {
                        value: <%=Fridayfinish%>,
                        itemStyle: {
                            color: '#fc8452'
                        }
                    },
                    {
                        value: <%=Saturdayfinish%>,
                        itemStyle: {
                            color: '#7ed3f4'
                        }
                    },
                    {
                        value: <%=Sundayfinish%>,
                        itemStyle: {
                            color: '  #40b27d'
                        }
                    }


                ],
                type: 'bar',
                showBackground: true,
                backgroundStyle: {
                    color: 'rgba(180, 180, 180, 0.2)'
                }
            }
        ]
    };

    option && myChart.setOption(option);

</script>

</html>
